<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>Exceed - Responsive Bootstrap Template</title>

		<!-- stylesheets -->
		<link rel="stylesheet" type="text/css" href="/bootstrap/css/common.css" />
		<!-- ZUI 标准版压缩后的 CSS 文件 -->
		<link rel="stylesheet" href="//cdn.bootcss.com/zui/1.9.1/css/zui.min.css">
		<!-- ZUI Javascript 依赖 jQuery -->
		<script src="//cdn.bootcss.com/zui/1.9.1/lib/jquery/jquery.js"></script>
		<!-- ZUI 标准版压缩后的 JavaScript 文件 -->
		<script src="//cdn.bootcss.com/zui/1.9.1/js/zui.min.js"></script>

		<link href="/bootstrap/css/bootstrap.min.css" rel="stylesheet">
		<link href="/css/font-awesome.css" rel="stylesheet">
		<link href="/css/ionicons.css" rel="stylesheet">
		<!-- <link href="css/linea.css" rel="stylesheet"> -->
		<link href="/css/owl.carousel.css" rel="stylesheet">
		<link href="/css/style.css" rel="stylesheet">

		<link rel="stylesheet" type="text/css" href="/css/style2.css" />
		<script type="text/javascript" src="/js/modernizr.custom.28468.js"></script>

		<link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:200i,300,300i,400,600,700,700i,900" rel="stylesheet">
		<link href="https://fonts.googleapis.com/css?family=Cardo:400,400i,700" rel="stylesheet">

		<style>
			.media-body>.title{
				cursor: pointer;
			}
			.media-body>.title:hover{
				text-decoration: underline;
			}
		</style>
	</head>
	<body>
		<!-- navbar -->
		<header>
			<nav class="navbar navbar-inverse navbar-fixed-top">
				<div class="container nav-search">
					<div class="navbar-header">
						<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false"
						 aria-controls="navbar">
							<span class="sr-only">Toggle navigation</span>
							<span class="icon-bar"></span>
							<span class="icon-bar"></span>
							<span class="icon-bar"></span>
						</button>
						<a class="navbar-brand" href="index">Exceed</a>
					</div>

					<div id="navbar" class="navbar-collapse collapse nav-top" >
						<ul class="nav navbar-nav navbar-right" style="margin-left: 50px">
							<li class="active"><a href="index">首页</a></li>
							<li><a href="articleSort">文章</a></li>
							<li  th:if="${session.name==null}"><a href="contact">登录|注册</a></li>
							<li  th:if="${session.name!=null}"><a class="iconfont icon-wodexuanzhong" th:text="${session.name}" href="home"></a></li>
							<li><a href="about">关于我们</a></li>
						</ul>
					</div>
					<div class="search-top">
						<div class="input-group ">
							<div class="input-control search-box search-box-circle has-icon-left has-icon-right search-example" id="searchboxExample">
								<input id="inputSearchExample3" type="search" class="form-control search-input" placeholder="搜索">
								<label for="inputSearchExample3" class="input-control-icon-left search-icon"><i class="icon icon-search"></i></label>
							</div>
							<span class="input-group-btn">
								<button class="btn btn-primary" onclick="search()" type="button" style="height: 34px;">搜索</button>
							</span>
						</div>
					</div>
				</div>
			</nav>
			<script>
                function search(){

                    console.log($(".search-top .search-input").val())
                    location.href="search?search="+$(".search-top .search-input").val();
                }
			</script>
		</header>
		<section class="home">
			<div class="container-fluidd">
				<div class="row">
					<div class="col-md-12">
						<div id="da-slider" class="da-slider">

							<div class="da-slide" th:each="car :${carsouel.list}">
								<h2 th:text="${car.des}"></h2>
								<a  th:value="${car.id}" th:ss="${car.id}" class="da-link" style="z-index: 999">阅读更多</a>
								<div class="da-img"><img th:src="${car.img}" th:if="${car.img!=''}"  alt="image01" /></div>
							</div>

							<nav class="da-arrows">
								<span class="da-arrows-prev"><i class="ion ion-ios-arrow-left"></i></span>
								<span class="da-arrows-next"><i class="ion ion-ios-arrow-right"></i></span>
							</nav>
					</div>
				</div>
			</div>

			<script>
                $("#da-slider .da-link").click(function(){
                    console.log($(this).attr("value"))
                    location.href="detail?id="+$(this).attr("value");
                })
			</script>
		</section>
		<!-- feature -->
		<section class="feature">
			<div class="container">
				<div class="row">
					<div class="col-md-5 col-sm-6 col-md-offset-1">
						<img class="img-responsive center-block" th:src="${today.list[0].img}" alt="" />
					</div>
					<div class="col-md-5 col-sm-6">
						<div class="feature-content" >
							<h5>今日 美文</h5>
							<h3 th:text="${today.list[0].title}"></h3>
							<p th:utext="${'文章简介：'+today.list[0].des}"></p>
							<a class="btn btn-primary more"  th:value="${today.list[0].id}">阅读更多</a>

						</div>
					</div>
					<script>
                        $(".feature-content>.more").click(function(){
                            // $(this).attr("value");
							console.log($(this).attr("value"))
                            location.href="detail?id="+$(this).attr("value");
                        })
					</script>
				</div>
			</div>
		</section>

		<!-- services -->
		<section class="services">
			<div class="container">
				<div class="row">
					<div class="col-md-12">
						<h1 class="sec-title">最新 <span>美文</span></h1>
					</div>
					<div class="col-md-4 col-sm-6 col-xs-12" th:each="new1 : ${data1.list}">

						<div class="media service-item">
							<div class="media-left">
								<div><i class="icon icon-basic-gear"></i></div>
							</div>
							<div class="media-body">
								<span class="title"  th:value="${new1.id}" th:text="${new1.title}"></span>
								<p   th:text="${new1.des}"></p>
								<!--th:href="${'detail?id='+${new1.id}}"-->
							</div>
						</div>
					</div>

				</div>
			</div>
			<script>
                $(".media-body>.title").click(function(){
                    // $(this).attr("value");
                    location.href="detail?id="+$(this).attr("value");
                })
			</script>
		</section>
		<div class="tlinks">Collect from <a href="http://www.cssmoban.com/">自助建站</a></div>
		<!-- projects -->
		<section class="projects">
			<div class="container">
				<div class="row">
					<div class="col-md-3 col-sm-6">
						<div class="media project-item">
							<div class="media-left">
								<div class="project-numb">45</div>
							</div>
							<div class="media-body">
								<h4 class="media-heading">游客</h4>
								<span>Sendisse quis malesuada</span>
							</div>
						</div>
					</div>
					<div class="col-md-3 col-sm-6">
						<div class="media project-item">
							<div class="media-left">
								<div class="project-numb">12</div>
							</div>
							<div class="media-body">
								<h4 class="media-heading">文章类别</h4>
								<span>Sendisse quis malesuada</span>
							</div>
						</div>
					</div>
					<div class="col-md-3 col-sm-6">
						<div class="media project-item">
							<div class="media-left">
								<div class="project-numb">130</div>
							</div>
							<div class="media-body">
								<h4 class="media-heading">文章</h4>
								<span>Sendisse quis malesuada</span>
							</div>
						</div>
					</div>
					<div class="col-md-3 col-sm-6">
						<div class="media project-item">
							<div class="media-left">
								<div class="project-numb">13</div>
							</div>
							<div class="media-body">
								<h4 class="media-heading">会员</h4>
								<span>Sendisse quis malesuada</span>
							</div>
						</div>
					</div>
				</div>
			</div>
		</section>

		<!-- blog --->
		<section class="blog">
			<div class="container">
				<div class="row">
					<div class="col-md-12">
						<h1 class="sec-title"><span>最新</span>新闻</h1>
					</div>
					<div class="col-md-4 col-sm-6" th:each="news1 : ${NEWS.list}">
						<div class="caption-img">
							<div class="blog-img-overlay">
								<img class="img-responsive" th:src="${news1.img}" alt="" />
								<div>
									<h5>Design</h5>
								</div>
							</div>
							<div class="caption-tag">
			<h3 th:text="${news1.title}"></h3>
								<p th:text="${news1.des}"></p>
								<ul class="list-inline blog-comment">
									<li th:text="${news1.disCount}"><i class="icon icon-basic-message-txt"></i></li>

									<li class="pull-right" th:id="${news1.id}"><i  class="icon icon-basic-spread"></i>阅读更多</li>
								</ul>
							</div>
						</div>
						</div>
					<script>
						$(".blog-comment .pull-right").click(function(){
						    location.href="detail?id="+$(this).attr("id");
						})
					</script>
				</div>
			</div>
		</section>

		<!-- footer -->
		<footer class="footer">
			<div class="container">
				<div class="row">
					<div class="col-md-2  col-sm-3 col-xs-6">
						<div class="footer-logo">
							<div class="footer-logo-text">Exceed</div>
							<p>Powered By Download Manager</p>
						</div>
					</div>
					<div class="col-md-2 col-sm-3 col-xs-6">
						<h3>Links</h3>
						<ul class="list-unstyled links">
							<li>About</li>
							<li>Services</li>
							<li>History</li>
							<li>Contact Us</li>
						</ul>
					</div>
					<div class="col-md-2 col-sm-3 col-xs-6">
						<h3>Pages</h3>
						<ul class="list-unstyled links">
							<li>About</li>
							<li>Services</li>
							<li>History</li>
							<li>Contact Us</li>
						</ul>
					</div>
					<div class="col-md-2 col-sm-3 col-xs-6">
						<h3>Legal</h3>
						<ul class="list-unstyled links">
							<li>About</li>
							<li>Services</li>
							<li>History</li>
							<li>Contact Us</li>
						</ul>
					</div>
					<div class="col-md-2 col-sm-3 col-xs-6">
						<h3>Social</h3>
						<ul class="list-unstyled links">
							<li><i class="ion ion-social-facebook"></i>facebok</li>
							<li><i class="ion ion-social-twitter"></i>Twitter</li>
							<li><i class="ion ion-social-linkedin"></i>Linkedin</li>
							<li><i class="ion ion-social-googleplus"></i>Google+</li>
						</ul>
					</div>
					<div class="col-md-2 col-sm-3 col-xs-6">
						<h3>Contact</h3>
						<ul class="list-unstyled links">
							<li>554A, Comflare </li>
							<li>Avenue</li>
							<li>01234 567 890</li>
							<li>hi@comflare.com</li>
						</ul>
					</div>
				</div>
				<hr>
				<div class="row">
					<div class="col-md-12">
						<div class="copyright">
							<p class="text-center">&copy;Designed By Scripteden 2016 / More Templates <a href="http://www.cssmoban.com/"
								 target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a></p>
							<!--ul class="list-inline pull-right">
                                <li>Privacy Policy </li>
                                <li>Terms Of Use</li>
                            </ul-->
						</div>
					</div>
				</div>
			</div>
		</footer>

		<!-- javascript -->
		<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
		<script src="/js/jquery-v1.11.3.js"></script>
		<script src="/bootstrap/js/bootstrap.min.js"></script>
		<script src="/js/owl.carousel.js"></script>
		<script src="/js/isotope.pkgd.js"></script>
		<script type="text/javascript" src="/js/jquery.cslider.js"></script>
		<script src="/js/custom.js"></script>
	</body>
</html>
